import variables from '@/styles/variables.module.scss'
export const useSttingStore = defineStore(
  'setting',
  () => {
    // variables
    const settings = reactive({
      theme: variables.theme,
      originalTheme: '',
      tagsView: false,
      logo: false,
      fixedHeader: true
    })
    type ISetting = typeof settings

    const changeSetting = <T extends keyof ISetting>({
      key,
      value
    }: {
      key: T
      value: ISetting[T]
    }) => {
      settings[key] = value
    }

    return { changeSetting, settings }
  },
  {
    persist: {
      storage: sessionStorage,
      pick: ['settings.theme', 'settings.tagsView', 'settings.logo']
    }
  }
)
